<!DOCTYPE html>
<!--[if IE 7]>    <html class="no-js ie7 ie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 ie" lang="en"> <![endif]-->
<!--[if IE 9]>    <html class="no-js ie9 ie" lang="en"> <![endif]-->
<!--[if gt IE 9]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
	<head>
		<meta charset="utf-8" />
		<title>意见反馈_${webName}</title>
		<meta name="description" content="" />
		<meta name="author" content="HuangBQ | ${wwwRoot}" />
		<#include "../inc/head-common.ftl">
		<#include "../inc/wysiwyg.ftl">
	</head>
	<body>
		<#include "../inc/header.ftl">
		
		<!-- Main content -->
		<div class="container" role="main">
		
			<!-- Breadcrumbs -->
			<ul class="breadcrumb">
				<li><a href="${wwwRoot}"><span class="icon-home"></span> ${wwwName}</a></li>
				<li><a href="${webRoot}">${webName}</a></li>
				<li class="active">意见反馈</li>
			</ul>
			<!-- Breadcrumbs -->
			
			<!-- Main data container -->
			<div class="content">
			
				<!-- Page header -->
				<div class="page-header">
					<h1><span class="icon-edit"></span> 意见反馈</h1>
				</div>
				<!-- /Page header -->
				
				<!-- Tab content -->
				<div class="tab-content page-container">
					
					<!-- Tab #advanced -->
					<div class="tab-pane active">

						<!-- Grid row -->
						<div class="row">
							
							<!-- Wysihtml5 -->
							<article class="span8">
								
								<form id="frmAddFeedBack">
									<fieldset>
										<!--legend>如有不爽，敬请吐槽</legend-->
										<div class="alert alert-success">
											<img src="${uploadRoot}avatar/default.png" alt="小讲" /> <strong>嘿！${Session["dw_name"]?default("无名士")}</strong>，学习中若有不爽欢迎来喷，我们努力改进！若提出具体建议，小讲感激万分，没准有惊喜哦！
										</div>
										
										<div class="control-group">
											<div class="controls">
												<textarea id="editor" name="feedback" placeholder="请填写你的宝贵意见 ..." rows="8"></textarea>
											</div>
										</div>
										<div class="form-actions">
											<button class="btn btn-primary btn-wuxia btn-large"  id="addAdvise" type="button">提交反馈</button>
											<input type="reset" value="Reset form!" style="display:none;">
										</div>
									</fieldset>
								</form>
							<table class="datatable table table-striped" id="example">
								<tbody>															
								</tbody>
							</table>

							</article>

							<article class="span4">									
									<div class="alert alert-block">
										<p><span class="fam-lightbulb"></span> <strong>你们的建议和支持是我们前进的动力</strong></p>
										<p style="color:red">通知到的小伙伴们请注意查收邮件，小讲需要你的地址以便寄送礼物，感谢你们的宝贵建议！</p>
										<p><code>2014年12月份</code>获得大讲台小礼物的用户名单：李小青、党群、李小帅、张晓晓、李明。</p>
										<p><code>2014年11月份</code>获得大讲台小礼物的用户名单：胡天平、李白、求剑、党群、李小帅、张晓晓、李明。</p>
										<p><code>2014年10月份</code>获得大讲台小礼物的用户名单：印锡、李白、求剑、党群、李小帅。</p>
									</div>
									
							</article>
							<!-- /Page grid cell (4 blocks) -->
							
						</div>
						<!-- /Grid row -->
					
					</div>
					<!-- /Tab #advanced -->
				
				</div>
				<!-- /Tab content -->
			
			</div>
			<!-- /Main data container -->
			
		</div>
		<!-- /Main content -->
		
		<#include "../inc/footer.ftl">

		<script>
			$(document).ready(function() {
				/*提交表单*/
				$('#addAdvise').click(function(){
				      var flag = checkForm();
				      if(flag==false){
				         $(this).pops({title:'', text:'请将内容填写完整！',type:'error',top:10, left:120, showClose : false,timeout:3000});
				         return false;
				      }
				      var ajax_url = '${webRoot}feedback/add.do';/*表单地址*/
				      var ajax_type = 'POST';/*表单提交类型*/
				      var ajax_data = $("#frmAddFeedBack").serialize();/*表单数据*/
				      jQuery.ajax( {  
				           type : ajax_type,  
				           url : ajax_url,  
				           data : ajax_data,  
				           dataType : 'json',  
				           success : function(data) { 
				           	if(data != null) {
				           	    var $frmAddFeedBack=$('#frmAddFeedBack');
				           	    var $h3=$('<h3>用户  '+data.name+' 建议：</h3>');
				           	    var $blockquote =$('<blockquote><p>'+data.advise+'</p><p>&nbsp;</p><small>我也表个态：<span style="cursor:pointer;"  onclick="praise('+data.fid+',1,this)" class="icon-thumbs-up"></span> 我附议（<span>0</span>） &nbsp;&nbsp;&nbsp;&nbsp; <span style="cursor:pointer;"  onclick="praise('+data.fid+',0,this)" class="icon-thumbs-down"></span> 我反对 （<span>0</span>）</small><p>&nbsp;</p><small><img src="${uploadRoot}avatar/default.png" alt="小讲" /> 小讲：<code>还未来得及处理，请稍候...</code></small></blockquote>');
				           	     $frmAddFeedBack.after($h3);
				           	     $h3.after($blockquote);
				           	    clearTextArea();//清空editor
				           		$('#addAdvise').pops({title:'', text:'感谢你的宝贵意见！',top:10, left:120, showClose : false,timeout:3000});
				           	} else {
				           		$('#addAdvise').pops({title:'', text:'意见反馈失败！',type:'error',top:10, left:120, showClose : false,timeout:3000});
				           	}		       
				           },  
				           error : function(data) {   
				           }  
				      }); 
				});
			});
			/*验证表单*/
			function checkForm(){
			     var flag=true;
			     var feedback = $.trim($('#editor').val());
			     if(feedback==""){
			         flag=false;
			     }
			     return flag;
			}
			/*给回复点赞*/
			function praise(fid,param,obj){
			   var praise=$(obj).attr("class");
			   var index = praise.indexOf("fam");
			   if(index<0){
			      var arr = praise.split("-");
			      $(obj).attr("class","fam-thumb-"+arr[2]);
			      if(param==1){
			         var supportnum = parseInt($(obj).next().html());
			         $(obj).next().html(supportnum+1);
			      }else{
			      	 var againstnum = parseInt($(obj).next().html());
			         $(obj).next().html(againstnum+1);
			      }
			      support(fid,param,obj); 
			      $(obj).pops({title:'', text:'感谢投票！',top:25, left:0, showClose : false,timeout:400});
			   }			   
			}
			/*点赞*/
			function support(fid,param,obj){
			          var ajax_url = '${webRoot}feedback/participate.do';/*表单地址*/
				      var ajax_type = 'POST';/*表单提交类型*/
				      jQuery.ajax( {  
				           type : ajax_type,  
				           url : ajax_url,  
				           data : {fid:fid,param:param},  
				           dataType : 'json',  
				           success : function(data) {        
				           },  
				           error : function(data) {  
				             
				           }  
				      });
			}
		</script>	
		<!-- jQuery DataTable -->
		<script src="${scriptRoot}plugins/dataTables/jquery.datatables.min.js"></script>
		<script>
            /*js解决通过json传来的timestamp类型时间的显示问题    time即是timestamp中的time属性的值*/
            function timeStamp2String(time){
			    var datetime = new Date();
			    datetime.setTime(time);
			    var year = datetime.getFullYear();
			    var month = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
			    var date = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
			    var hour = datetime.getHours()< 10 ? "0" + datetime.getHours() : datetime.getHours();
			    var minute = datetime.getMinutes()< 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
			    var second = datetime.getSeconds()< 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
			    return year + "-" + month + "-" + date;
			}

			
			/* API method to get paging information */
			$.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings )
			{
				return {
					"iStart":         oSettings._iDisplayStart,
					"iEnd":           oSettings.fnDisplayEnd(),
					"iLength":        oSettings._iDisplayLength,
					"iTotal":         oSettings.fnRecordsTotal(),
					"iFilteredTotal": oSettings.fnRecordsDisplay(),
					"iPage":          Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ),
					"iTotalPages":    Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength )
				};
			}
			
			/* Bootstrap style pagination control */
			$.extend( $.fn.dataTableExt.oPagination, {
				"bootstrap": {
					"fnInit": function( oSettings, nPaging, fnDraw ) {
						var oLang = oSettings.oLanguage.oPaginate;
						var fnClickHandler = function ( e ) {
							e.preventDefault();
							if ( oSettings.oApi._fnPageChange(oSettings, e.data.action) ) {
								fnDraw( oSettings );
							}
						};
			
						$(nPaging).addClass('pagination').append(
							'<ul>'+
								'<li class="prev disabled"><a href="#">&larr; '+oLang.sPrevious+'</a></li>'+
								'<li class="next disabled"><a href="#">'+oLang.sNext+' &rarr; </a></li>'+
							'</ul>'
						);
						var els = $('a', nPaging);
						$(els[0]).bind( 'click.DT', { action: "previous" }, fnClickHandler );
						$(els[1]).bind( 'click.DT', { action: "next" }, fnClickHandler );
					},
			
					"fnUpdate": function ( oSettings, fnDraw ) {//每次查询都会执行此方法，初始化分页
					     /*图片路径替换*/
				        $(".span8").find("img").each(function(){
				            var src = $(this).attr("src");
				            var index = src.indexOf("http://");
				            if(index<0){//如果已经是完整路径不替换
							  		src = "${uploadRoot}" + src;
									$(this).attr("src", src);
				            }
						});
						$("#example").find("thead").remove();//关闭thead标签
						var iListLength = 5;
						var oPaging = oSettings.oInstance.fnPagingInfo();
						var an = oSettings.aanFeatures.p;
						var i, j, sClass, iStart, iEnd, iHalf=Math.floor(iListLength/2);
			
						if ( oPaging.iTotalPages < iListLength) {
							iStart = 1;
							iEnd = oPaging.iTotalPages;
						}
						else if ( oPaging.iPage <= iHalf ) {
							iStart = 1;
							iEnd = iListLength;
						} else if ( oPaging.iPage >= (oPaging.iTotalPages-iHalf) ) {
							iStart = oPaging.iTotalPages - iListLength + 1;
							iEnd = oPaging.iTotalPages;
						} else {
							iStart = oPaging.iPage - iHalf + 1;
							iEnd = iStart + iListLength - 1;
						}
			
						for ( i=0, iLen=an.length ; i<iLen ; i++ ) {
							// Remove the middle elements
							$('li:gt(0)', an[i]).filter(':not(:last)').remove();
			
							// Add the new list items and their event handlers
							for ( j=iStart ; j<=iEnd ; j++ ) {
								sClass = (j==oPaging.iPage+1) ? 'class="active"' : '';
								$('<li '+sClass+'><a href="#">'+j+'</a></li>')
									.insertBefore( $('li:last', an[i])[0] )
									.bind('click', function (e) {
										e.preventDefault();
										oSettings._iDisplayStart = (parseInt($('a', this).text(),10)-1) * oPaging.iLength;
										fnDraw( oSettings );
									} );
							}
			
							// Add / remove disabled classes from the static elements
							if ( oPaging.iPage === 0 ) {
								$('li:first', an[i]).addClass('disabled');
							} else {
								$('li:first', an[i]).removeClass('disabled');
							}
			
							if ( oPaging.iPage === oPaging.iTotalPages-1 || oPaging.iTotalPages === 0 ) {
								$('li:last', an[i]).addClass('disabled');
							} else {
								$('li:last', an[i]).removeClass('disabled');
							}
						}
					}
				}
			});			
			/* Table #example */
			var table;
			$(document).ready(function() { 
				table= $('.datatable').dataTable( {
					"sPaginationType": "bootstrap",
					"iDisplayLength":6,//每页显示条数
					"oLanguage": {
						"sLengthMenu": "_MENU_ 记录每页",
						"sZeroRecords": "抱歉， 没有找到",
						"sProcessing" : "正在加载中......",
						"sInfoEmpty": "没有数据",
						"sSearch" : "搜索",
						"sInfo" : "从 _START_ 到  _END_ 条记录 总记录数为 _TOTAL_ 条", 
						"oPaginate": {    
		                    "sFirst" : "第一页",    
		                    "sPrevious" : "上一页",    
		                    "sNext" : "下一页",    
		                    "sLast" : "最后一页"    
		                }  
					},
					"bProcessing": true,//关闭加载数据提示
					"bServerSide": true,
					"bSort": false, //关闭排序功能
					"bLengthChange": false,//关闭选择每页显示数量
					"bFilter": false, //关闭过滤功能
					"bInfo": false,//关闭页脚信息
					"sAjaxSource": "${webRoot}feedback/fblist.do",
					"aoColumns": [
						{ "sName": "fid","bVisible" : false },//0
				        { "sName": "name" ,sWidth: '25%'},//1
				        { "sName": "advise" ,"bVisible" : false},//2
				        { "sName": "supportnum" ,"bVisible" : false},//3
				        { "sName": "againstnum" ,"bVisible" : false},//4
				        { "sName": "auditadvise" ,"bVisible" : false},//5
				        { "sName": "auditstatus","bVisible" : false}//6
				    ],
				    
				    "fnRowCallback" : function(nRow, aData, iDisplayIndex) {  
				        var auditadvise="";
				        if(aData[6]==0){
				        	auditadvise="<code>还未来得及处理，请稍候...</code>";
				        }else{
				            auditadvise=aData[5];
				        }
				        $('td:eq(0)', nRow).html('<h3>用户  '+aData[1]+'建议：</h3><blockquote><p>'+aData[2]+'</p><p>&nbsp;</p><small>我也表个态：<span style="cursor:pointer;" onclick="praise('+aData[0]+',1,this)" class="icon-thumbs-up"></span> 我附议（<span>'+aData[3]+'</span>） &nbsp;&nbsp;&nbsp;&nbsp; <span style="cursor:pointer;"  onclick="praise('+aData[0]+',0,this)" class="icon-thumbs-down"></span> 我反对 （<span>'+aData[4]+'</span>）</small><p>&nbsp;</p><small><img src="${uploadRoot}avatar/default.png" alt="小讲" /> 小讲：'+auditadvise+'</small></blockquote>');
	                    return nRow;  
                    }
				});
			});
		</script>
		<script src="${scriptRoot}pops.js" type="text/javascript"></script>
</body>
</html>
